import { createRouter, createWebHistory } from 'vue-router'
import store from '../store' // 引入 Vuex store
import { showMsg } from '@/utils/showMsg'

const routes = [
  {
    path: '/',
    name: 'Index',
    component: () => import('../views/Index.vue')
  },
  {
    path: '/gonggao',
    name: 'gonggao',
    component: () => import('../views/GongGao.vue')
  },
  {
    path: '/services',
    name: 'Services',
    component: () => import('../views/Services.vue')
  },
  {
    path: '/about',
    name: 'About',
    component: () => import('../views/About.vue')
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import('../views/Login.vue')
  },
  {
    path: '/info',
    name: 'Info',
    component: () => import('../views/UserInfo.vue'),
    children: [
      {
        path: 'myOrderpays', // 我的充值订单
        component: () => import('../views/UserInfo/OrderPayment.vue')
      },
      {
        path: 'myOrdercqs',
        component: () => import('../views/UserInfo/OrderCqs.vue')
      },
      {
        path: 'interMsg', // 我的钱包
        component: () => import('../views/UserInfo/InternalMsg.vue')
      },
      {
        path: 'wallet', // 我的钱包
        component: () => import('../views/UserInfo/Wallet.vue')
      },
      {
        path: 'userinfo', // 个人信息
        component: () => import('../views/UserInfo/Info.vue')
      },
      {
        path: 'settings', // 系统设置
        component: () => import('../views/UserInfo/Settings.vue')
      }
    ]
  },
  {
    path: '/admin',
    name: 'admin',
    component: () => import('../views/Admin/Admin.vue'),
    children: [
      {
        path: 'index',
        name: 'adminindex',
        component: () => import('../views/Admin/com/Index.vue')
      },
      {
        path: 'userman',
        name: 'userman',
        component: () => import('../views/Admin/com/UserMan.vue')
      },
      {
        path: 'message',
        name: 'adminmsg',
        component: () => import('../views/Admin/com/Message.vue')
      },
      {
        path: 'orderman',
        name: 'orderman',
        component: () => import('../views/Admin/com/OrderMan.vue')
      },
      {
        path: 'adminSys',
        name: 'adminsys',
        component: () => import('../views/Admin/com/SysSetting.vue')
      },
      {
        path: 'statistics',
        name: 'statistics',
        component: () => import('../views/Admin/com/Statistics.vue')
      }
    ]
  },
  {
    path: '/pay',
    name: 'Pay',
    component: () => import('../views/UserInfo/PayForBalance.vue')
  },
  {
    path: '/map',
    name: 'GuiJiMap',
    component: () => import('../views/common/GuiJiMap.vue')
  },
  {
    path: '/test',
    name: 'UnitTest',
    component: () => import('../views/common/UnitTest.vue')
  },
  {
    path: '/loading',
    name: 'Loading',
    component: () => import('../views/common/LoadingPage.vue')
  },
  // 捕获所有未定义的路由并重定向到 '/'
  {
    path: '/:pathMatch(.*)*', // 匹配所有路径
    redirect: '/' // 重定向到首页
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

// 路由守卫
router.beforeEach((to, from, next) =>
{
  const isLoggedIn = store.getters.isLoggedIn
  const publicPaths = ['/', '/login', '/about', '/test', '/loading', '/gonggao', '/pay']
  const adminPaths = ['/admin', '/admin/*'] // 添加对 /admin 及其子路由的匹配

  // 显示加载动画
  const loadingComponent = document.getElementById('loading-animation')
  if (loadingComponent)
  
    loadingComponent.style.display = 'block'
  

  // 使用正则表达式匹配动态路由
  const isPayRoute = /^\/pay\/\d+\d+$/.test(to.path)

  // 检查是否是 /admin 或其子路由
  const isAdminRoute = adminPaths.some(path => to.path.startsWith(path))

  if (!isLoggedIn && !publicPaths.includes(to.path) && !isPayRoute)
  {
    showMsg('未登录', '🤨您似乎还没有登录，赶快登录吧~', 'warning')
    next('/login')
  }
  else if (isAdminRoute && store.state.user.state !== '888')
  {
    // 如果是 /admin 路由且用户状态不是 '888'，拦截并跳转至首页
    showMsg('权限不足', '😢您没有权限访问此页面，请联系管理员。', 'warning') // 提醒用户
    next('/')
  }
  else
  
    next()
})

// 添加全局后置钩子，在路由跳转完成后隐藏加载动画
router.afterEach(() =>
{
  // 隐藏加载动画组件
  const loadingComponent = document.getElementById('loading-animation')
  if (loadingComponent)
  {
    setTimeout(() =>
    {
      loadingComponent.style.display = 'none'
    }, 1200)
  }
  // 强制滚动到页面顶部
  window.scrollTo(0, 0)
})

export default router
